<template>
	<view class="">
		<view class=""  style="background: #002B58;color: #fff;height: 366rpx;">
			<view class="_flex pages _justify_between" style="padding-top: 70rpx;font-size: 35rpx;">
				<view class="" >
					<view class="" style="font-weight: bold;">
						{{ itemJson.seriesName }} ({{ itemJson.modelName }})
					</view>
					<view class="_paddingTop" style="font-size: 28rpx;">
						{{ itemJson.modelYear }}款
					</view>
				</view>
				<!-- <view class="" @click="edit">
					<u-icon name="edit-pen" size="30" style="margin-right: 10rpx;"></u-icon>
					<text style="font-size: 24rpx;">编辑</text>
				</view> -->
			</view>
			<view class="pages contentBox" >
				<view class="" style="font-size: 35rpx; font-weight: bold;padding-bottom: 20rpx;color: #002B58;">
					爱车详情
				</view>
				<view class="_flex _justify_between" >
					<view class=""  style="width: 50%;text-align: center;">
						<view class="_paddingTop" style="font-size: 44rpx; color: #DD6161;">
							{{ obj.valuationPrice }}万元
						</view>
						<view class="_paddingTop" style="color: #002B58;">
							{{ obj.minPrice }}~{{ obj.maxPrice }}万元
						</view>
						<view class="_paddingTop" style="color: #888;font-size: 22rpx;">
							车辆售价参考范围
						</view>
					</view>
					<view class="" style="width: 50%;text-align: center;">
						<view class="_paddingTop" style="font-size: 44rpx; color: #DD6161;">
							{{ obj.assetScore }}分
						</view>
						<view class="_paddingTop" style="color: #666;">
							车辆资产分值
						</view>
						<view class="_paddingTop" style="color: #888;font-size: 22rpx;">
							打败了{{ obj.bfb }}%的同车型用户
						</view>
					</view>
				</view>
				<view class="_flex _justify_between page _marginTop " style="padding-top: 30rpx; border-top: 1px solid #eee;" >
					<view class="_flex align-items_center" style="color: #888;">
						<u-icon name="question-circle" style="margin-right: 10rpx;" size="35"></u-icon>
						了解车辆保值方式
					</view>
					<view style="color: #888;">
						去了解
						<u-icon name="arrow-right" style="margin-left: 10rpx;"></u-icon>
					</view>
				</view>
			</view>
		</view>
		<view class="pages echarBox" >
			<view class="_flex _justify_between align-items_center" style="100rpx">
				<view class="" style="font-size: 35rpx; font-weight: bold;color: #002B58;">
					爱车资产走势
				</view>
				<view class="" style="color: #888;">
					单位：万元
				</view>
			</view>
			<zEacher :recentEstimate="recentEstimate"></zEacher>
		</view>
		<view class="pages _marginTop">
			<u-button type="primary" class="" @click="mianfeiReportDetail">查看详细估值报告</u-button>
		</view>
	</view>
</template>

<script>
import API from "@/api/morePage.js"
export default {
	data() {
		return {
			itemJson:null,
			obj: null,
			recentEstimate: []
		};
	},
	onLoad(option) {
		this.itemJson = JSON.parse(decodeURIComponent(option.item));
		console.log(this.itemJson)
		if(this.itemJson){
			this.getCarValuation(this.itemJson.myCarId)
		}
	},
	methods:{
		// edit(){
		// 	uni.navigateTo({
		// 		url:`./editCarInfo?item=${this.itemJson}&type=Y`
		// 	})
		// },
		getCarValuation(id){
			API.getCarValuation({myCarId:id }).then(res=>{
				console.log(res)
				this.obj = res.data
				this.recentEstimate = res.data.recentEstimate
			})
		},
		mianfeiReportDetail(){
			API.getCarValuationBg({myCarId: this.itemJson.myCarId}).then(res=>{
				uni.navigateTo({
					url:`/pagesA/assessment/mianfeiReportDetail?data=${encodeURIComponent(JSON.stringify(res.data))}`
				})
			})
		}
	}
};
</script>
<style scoped>
	.contentBox{
		 background: #fff;
		 color: #333;
		 margin: 0 30rpx;
		 border-radius: 20rpx;
		 
		 box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
	}
	.echarBox{
		background-color: #fff; border-radius: 20rpx;margin:0 30rpx; margin-top: 300rpx;
	}
</style>